<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
	<div id="app">
		<button @click="lang">开始滚动</button>
		<button @click="stop">停止</button>
		<h2>{{msg}}</h2>
	</div>
	<script src="../vue.js"></script>
	<script type="text/javascript">
		var vm = new Vue({
			el:'#app',
			data:{
				msg:'猥琐发育，别浪！',
				interval:null
			},
			methods: {
				lang() {
					// 状态为开启时，不在启动新的定时器
					if (this.interval!==null) return;

					var status = true 
					// 可以var _this = this
					this.interval = setInterval( ()=> {
						// 截取第一个字符
						var start = this.msg.substring(0,1)
						// 后面所有字符
						var end = this.msg.substring(1)
						// 重新拼成新的字符串
						this.msg = end + start
					},150)
				},
				stop() {
					clearInterval(this.interval)
					// 清除定时器后重置状态
					this.interval = null
				}
			}
		});
	</script>
</body>
</html>